<template>
   <view>
      <view class="pop-txt" @click="popOpen">
         <image class="pop-icon" src="/static/photo_add1.png"></image>
        <view class="txt">
         {{ text }}{{ fileList.length>0? `(${fileList.length})`:'' }}
        </view>
      </view>
      <PopView :title="title" :popShow="popShow" @popClose="popClose" @popOpen="popOpen">
         <template slot="content">
            <view class="pop-content">
               <u-upload :fileList="fileList" accept="media" @afterRead="afterRead" @delete="deletePic" multiple :maxCount="maxCount">
               </u-upload>
            </view>
         </template>
      </PopView>
   </view>
</template>

<script>
import config from '@/utils/config'
export default {
   props: {
      text: {
         type: String,
         default: '上传图片'
      },
      fileList: {
         type: Array,
         default: []
      },
      multiple: {
         type: Boolean,
         default: true
      },
      maxCount: {
         type: Number,
         default: 20
      },
      title: {
         type: String,
         default: '上传图片'
      },
      uploadParams:{
         type:Object,
         default:{}
      }
   },
   data() {
      return {
         popShow: false
      }
   },
   methods: {
      // 删除图片
      deletePic(event) {
         let fileList = JSON.parse(JSON.stringify(this.fileList))
          fileList.splice(event.index,1)
         this.$emit('change', fileList)
      },
      // 新增图片
      async afterRead(event) {
         // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
         let lists = [].concat(event.file)
         let fileListLen = this.fileList.length
         let fileList = JSON.parse(JSON.stringify(this.fileList))
         lists.map((item) => {
            fileList.push({
               ...item,
               status: 'uploading',
               message: '上传中'
            })
            this.$emit('change', fileList)
         })
         for (let i = 0; i < lists.length; i++) {
            const result = await this.uploadFilePromise(lists[i].url)
            console.log(result)
            let item = fileList[fileListLen]
            fileList.splice(fileListLen, 1, Object.assign(item, {
               status: 'success',
               message: '',
               url: result
            }))
            this.$emit('change', fileList)
            fileListLen++
         }

         console.log(fileList)

      },
      uploadFilePromise(url) {
        console.log(url,this.uploadParams)
         return new Promise((resolve, reject) => {
            let a = uni.uploadFile({
               url: config.host+`?ac=upload_oss&wid=${this.uploadParams.wid}&mid=${this.uploadParams.mid}&pid=${this.uploadParams.pid}&type_name=${this.uploadParams.type_name}`, // 仅为示例，非真实的接口地址
              //url: config.host, 
              filePath: url,
               name: 'pics',
               header:{
                  'Authorization': wx.getStorageSync('token')||'',
               },
               formData: {
                  ac:'upload_oss',
                  wid:this.uploadParams.wid,
                  mid:this.uploadParams.mid,
                  pid:this.uploadParams.pid,
                  type_name:this.uploadParams.type_name
               },
               success: (res) => {
                   let result = JSON.parse(res.data)
                   console.log(result)
                   if(result.status==1){
                     resolve(result.data.url)
                   }
               }
            });
         })
      },
   }

}
</script>

<style scoped lang="scss" src="./assets/index.scss"></style>
